import "./App.css";
import TitleComp from "./comp/TitleComp.tsx";
import AbsComp from "./comp/AbsComp.tsx";
import AuthorList from "./comp/AuthorList.tsx";
import FigComp from "./comp/FigComp.tsx";
import type { FigureType } from "./types";
import model4 from "./assets/stage3.png";
// import CiteComp from "./comp/CiteComp.tsx";
// import PdfComp from "./comp/PdfComp.tsx";
// import FigListComp from "./comp/FigListComp.tsx";

function App() {
  const figInfo: FigureType[] | FigureType = {
    figTitle: "Structure of MGMFF model",
    figSrc: model4,
    // "https://gw.alipayobjects.com/zos/rmsportal/KDpgvguMpGfqaHPjicRK.svg",
    // message: "这是一个测试图片",
  };
  // const cite: string = "no BibTex here   " + "sdaf \ter  ";
  const absMessage: string = "aaaaa $ \frac{1}{1} $ sasd";
  return (
    <>
      <TitleComp></TitleComp>
      &emsp;
      <AuthorList></AuthorList>
      <AbsComp absMessage={absMessage}></AbsComp>
      {(() => {
        if (!Array.isArray(figInfo)) {
          //
          return (
            <FigComp
              figTitle={figInfo.figTitle}
              figSrc={figInfo.figSrc}
              message={figInfo.message}
            ></FigComp>
          );
        } else
          return figInfo.map((figInfoItem: FigureType) => {
            return (
              <FigComp
                figTitle={figInfoItem.figTitle}
                figSrc={figInfoItem.figSrc}
                message={figInfoItem.message}
              ></FigComp>
            );
          });
      })()}
      {/*<PdfComp></PdfComp>*/}
      {/*<CiteComp cite={cite}></CiteComp>*/}
      {/*<FigListComp></FigListComp>*/}
    </>
  );
}

export default App;
